<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.css">
    <link rel="stylesheet" href="../public/css/base.css">
    <link rel="stylesheet" href="../public/css/header.css">
    <link rel="stylesheet" href="../public/css/index.css">
    <link rel="stylesheet" href="../public/css/banner.css">
    <link rel="stylesheet" href="../public/css/content.css">
    <link rel="stylesheet" href="../public/css/footer.css">
    <link rel="stylesheet" href="../public/css/playJD.css">
</head>

<body>
    <!-- 顶部导航条 -->
    <header class="header">
        <div class="m-top">
            <div class="wrap f-cb">
                <div class="l-top">
                    <h1><a href="#" class="logo">网易云音乐</a></h1>
                    <div class="n-top">
                        <ul class="m-nav">
                            <li>
                                <span>

                                    <a href="#" class="fst">发现音乐</a>
                                    <sup class="sanjiao show"></sup>
                            </li>
                            <li>
                                <a href="#">我的音乐</a>
                                <sup class="sanjiao hide"></sup>
                            </li>
                            <li><a href="#">朋友</a></li>
                            <li><a href="#">商城</a></li>
                            <li>
                                <a href="#">音乐人</a>
                            </li>
                            <li class="download_c">
                                <a href="#">下载客户端</a>
                                <sup class="sanjiao hide"></sup>
                                <sup class="hot">&nbsp;</sup>
                            </li>
                        </ul>

                    </div>

                </div>
                <div class="r-top">
                    <div class="log"><a href="#" class="login">登录</a></div>
                    <a href="#" class="creater">创作者中心</a>
                    <div class="search">
                        <span class="parent">
                            <input type="text" class="s_btn" placeholder="音乐/视频/电台/用户">
                        </span>
                    </div>
                </div>
            </div>

        </div>
        <div class="subnav">
            <div class="wrap f-pr">
                <ul class="nav">
                    <li>
                        <a href="./index.html" class="click">
                            &nbsp;&nbsp;推荐&nbsp;&nbsp;
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            &nbsp;&nbsp;排行榜&nbsp;&nbsp;
                        </a>
                    </li>
                    <li>
                        <a href="./playlist.html" class="songList">
                            &nbsp;&nbsp;歌单&nbsp;&nbsp;
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            &nbsp;&nbsp;主播电台&nbsp;&nbsp;&nbsp;
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            &nbsp;&nbsp;歌手&nbsp;&nbsp;
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            &nbsp;&nbsp;新碟上架&nbsp;&nbsp;
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </header>
    <!-- 轮播图 -->
    <div class="banner-wrap-outer">
        <div class="banner-wrap"></div>
        <div class="banner row wrap">
            <div class="banner_img col-xs-9">
                <ul class="banner_img_ul">
                    <!-- <li><a href="#"><img src="../public/upload/img1.jpg" alt=""></a></li>
                    <li><a href="#"><img src="../public/upload/img2.jpg" alt=""></a></li>
                    <li><a href="#"><img src="../public/upload/img3.jpg" alt=""></a></li> -->
                </ul>
                <div class="banner_img_a">
                    <!-- <a href="#" class="pull-left banner_active"></a>
                    <a href="#" class="pull-left"></a>
                    <a href="#" class="pull-left"></a> -->
                </div>
            </div>
            <div class="banner_btn">
                <button class="bannerBtn last"></button>
                <button class="bannerBtn next"></button>
            </div>
            <div class="banner_down col-xs-3">
                <span>PC 安卓 iPhone WP iPad Mac 六大客户端</span>
                <!-- 下载客户端图片 -->
                <div class="btn_down"></div>
            </div>
        </div>
    </div>
    <!-- 内容部分 -->
    <div class="content_wrap">
        <div class="playlist">
            <!-- 热门推荐(hot_recommended) -->
            <div class="hot_recommended">
                <div class="h_title">
                    <div class="h_title_left pull-left">
                        <p class="pull-left">
                            热门推荐
                        </p>
                        <ul class="pull-left">
                            <li class="pull-left h_li"><a href="#">华语</a> </li>
                            <li class="pull-left line"><span>|</span> </li>
                            <li class="pull-left h_li"><a href="#">流行</a> </li>
                            <li class="pull-left line"><span>|</span> </li>
                            <li class="pull-left h_li"><a href="#">摇滚</a> </li>
                            <li class="pull-left line"><span>|</span> </li>
                            <li class="pull-left h_li"><a href="#">民谣</a> </li>
                            <li class="pull-left line"><span>|</span> </li>
                            <li class="pull-left h_li"><a href="#">电子</a> </li>
                        </ul>
                    </div>
                    <div class="h_title_right pull-right">
                        <a href="../views/playlist.html">更多</a>
                    </div>

                </div>
                <ul class="h_content">
                    <!-- <li>
                        <div class="songD">
                            <a href="#">
                                <div class="msk_img"></div>
                                <img src="../public/upload/h_img1.jpg" alt="">
                            </a>
                            <div class="songD_bottom">
                                <div class="songD_bottom_con">
                                    <div class="songD_bottom_con_ep pull-left">
                                        <div class="songD_bottom_con_ep_icon pull-left"></div>
                                        <p class="nb pull-left">23712</p>
                                    </div>
                                    <div class="songD_bottom_con_play pull-right">
                                        <a href="#"></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <a href="#">
                            <p class="song_desc">
                                【伤感纯音乐】难过需要释放
                            </p>
                        </a>
                    </li> -->

                    <!-- <li>
                        <div class="songD">
                            <a href="#">
                                <div class="msk_img"></div>
                                <img src="../public/upload/h_img4.jpg" alt="">
                            </a>
                            <div class="songD_bottom">
                                <div class="songD_bottom_con">
                                    <div class="songD_bottom_con_ep pull-left">
                                        <div class="songD_bottom_con_ep_icon pull-left"></div>
                                        <p class="nb pull-left">23712</p>
                                    </div>
                                    <div class="songD_bottom_con_play pull-right">
                                        <a href="#"></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <a href="#" class="radioA">
                            <i class="radio show"></i>
                            <p class="song_desc radioP">
                                威廉林赛：在长城上捡垃圾的外国老头，让国人反思
                            </p>
                        </a>
                    </li> -->

                </ul>
            </div>
            <!-- 新碟上架(new_disc) -->
            <div class="new_disc">
                <div class="n_title">
                    <div class="n_title_left pull-left">
                        <p class="pull-left">
                            新碟上架
                        </p>
                    </div>
                    <div class="n_title_right pull-right">
                        <a href="#">更多</a>
                    </div>

                </div>
                <div class="n-disk">
                    <div class="inner">
                        <a href="javascript:void(0);" class="inner_btn inner_last"></a>
                        <a href="javascript:void(0);" class="inner_btn inner_next"></a>
                        <div class="five_song">
                            <div class="big_imgBox">
                                <ul class="first_s">
                                    <!-- <li>
                                        <div class="u-cover u-cover-alb1">
                                            <img class="j-img"
                                                data-src="http://p4.music.126.net/hVVNPCyCxQV3U9HH8Y8fxA==/109951166363914914.jpg?param=100y100"
                                                src="http://p4.music.126.net/hVVNPCyCxQV3U9HH8Y8fxA==/109951166363914914.jpg?param=100y100">
                                            <a title="幸存者的负罪感" href="/album?id=132874562" class="msk"></a>
                                            <a href="javascript:;" class="icon-play f-alpha f-fr" title="播放"
                                                data-res-type="19" data-res-id="132874562" data-res-action="play"></a>
                                        </div>
                                        <p class="f-thide">
                                            <a title="幸存者的负罪感" href="/album?id=132874562" class="s-fc0 tit">幸存者的负罪感</a>
                                        </p>
                                        <p class="tit f-thide" title="王以太 / 艾热 AIR 101">
                                            <a class="s-fc3" href="/artist?id=12236125">王以太</a>
                                            &nbsp;/&nbsp;
                                            <a class="s-fc3" href="/artist?id=1203045">艾热 AIR</a>
                                        </p>
                                    </li>
                                     -->
                                </ul>
                                <ul class="second_s">
                                    <!-- <li>
                                        <div class="u-cover u-cover-alb1">
                                            <img class="j-img"
                                                data-src="http://p4.music.126.net/hVVNPCyCxQV3U9HH8Y8fxA==/109951166363914914.jpg?param=100y100"
                                                src="http://p4.music.126.net/hVVNPCyCxQV3U9HH8Y8fxA==/109951166363914914.jpg?param=100y100">
                                            <a title="幸存者的负罪感" href="/album?id=132874562" class="msk"></a>
                                            <a href="javascript:;" class="icon-play f-alpha f-fr" title="播放"
                                                data-res-type="19" data-res-id="132874562" data-res-action="play"></a>
                                        </div>
                                        <p class="f-thide">
                                            <a title="幸存者的负罪感" href="/album?id=132874562" class="s-fc0 tit">幸存者的负罪感</a>
                                        </p>
                                        <p class="tit f-thide" title="王以太 / 艾热 AIR">
                                            <a class="s-fc3" href="/artist?id=12236125">王以太</a>
                                            &nbsp;/&nbsp;
                                            <a class="s-fc3" href="/artist?id=1203045">艾热 AIR</a>
                                        </p>
                                    </li> -->

                                </ul>
                                <ul class="first_s">

                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 榜单(music_list) -->
            <div class="music_list">
                <div class="ml_title">
                    <div class="ml_title_left pull-left">
                        <p class="pull-left">
                            榜单
                        </p>
                    </div>
                    <div class="ml_title_right pull-right">
                        <a href="#">更多</a>
                    </div>

                </div>
                <div class="song_table">
                    <dl class="blk soaring_list">
                    </dl>
                    <dl class="blk newSong_list">
                        <dt>
                            <div class="cver">
                                <img src="../public/images/newsong.jpg" alt="">
                                <a href="/discover/toplist?id=19723756" class="msk" title="新歌榜"></a>
                            </div>
                            <div class="tit">
                                <a href="/discover/toplist?id=19723756" title="新歌榜">
                                    <h3 class="f-fs1 f-thide">新歌榜</h3>
                                </a>
                                <div class="blk_btn">
                                    <a href="javascript:;" class="s-bg s-play" title="播放">播放</a>
                                    <a href="javascript:;" class="s-bg s-collection" title="收藏">收藏</a>
                                </div>
                            </div>
                        </dt>
                        <dd>
                            <ol>
                                <li>
                                    <span class="no no-top">1</span>
                                    <a href="javascript:;" class="f-thide" title="又到梧桐吐绿时">又到梧桐吐绿时</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no no-top">2</span>
                                    <a href="javascript:;" class="f-thide" title="死性不改">死性不改</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no no-top">3</span>
                                    <a href="javascript:;" class="f-thide" title="耳鬼出风">耳鬼出风</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">4</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">5</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">6</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">7</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">8</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">9</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">10</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                            </ol>
                            <div class="checkMore">
                                <a href="javascript:;">查看全部></a>
                            </div>
                        </dd>

                    </dl>
                    <dl class="blk original_list">
                        <dt>
                            <div class="cver">
                                <img src="../public/images/yuanchuang.jpg" alt="">
                                <a href="/discover/toplist?id=19723756" class="msk" title="原创榜"></a>
                            </div>
                            <div class="tit">
                                <a href="/discover/toplist?id=19723756" title="原创榜">
                                    <h3 class="f-fs1 f-thide">原创榜</h3>
                                </a>
                                <div class="blk_btn">
                                    <a href="javascript:;" class="s-bg s-play" title="播放">播放</a>
                                    <a href="javascript:;" class="s-bg s-collection" title="收藏">收藏</a>
                                </div>
                            </div>
                        </dt>
                        <dd>
                            <ol>
                                <li>
                                    <span class="no no-top">1</span>
                                    <a href="javascript:;" class="f-thide" title="又到梧桐吐绿时">又到梧桐吐绿时</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no no-top">2</span>
                                    <a href="javascript:;" class="f-thide" title="死性不改">死性不改</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no no-top">3</span>
                                    <a href="javascript:;" class="f-thide" title="耳鬼出风">耳鬼出风</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">4</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">5</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">6</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">7</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">8</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">9</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                                <li>
                                    <span class="no">10</span>
                                    <a href="javascript:;" class="f-thide" title="以爱为囚">以爱为囚</a>
                                    <div class="oper">
                                        <a href="javascript:;" class="s-bg s-bg-11"></a>
                                        <a href="javascript:;" class="s-bg-12"></a>
                                        <a href="javascript:;" class="s-bg s-bg-13"></a>
                                    </div>
                                </li>
                            </ol>
                            <div class="checkMore">
                                <a href="javascript:;">查看全部></a>
                            </div>
                        </dd>
                    </dl>
                </div>
            </div>
        </div>
        <div class="musicians">
            <!-- 右侧用户登录 -->
            <div class="user-profile">
                <p class="n_l_desc">登录网易云音乐，可以享受无限收藏的乐趣，并且无限同步到手机</p>
                <div class="user_login">
                    <a href="javascript:;">用户登录</a>
                </div>
            </div>
            <!-- 入驻歌手 -->
            <div class="n-singer">
                <div class="n_hd">
                    <h3>
                        <span>入驻歌手</span>
                        <a href="javascript:;" class="pull-right">查看全部 ></a>
                    </h3>
                </div>
                <ul id="singer_list">
                    <li>
                        <a href="javascript:;" class="singerItem">
                            <div class="img_singer">
                                <img src="../public/upload/singer1.jpg" alt="">
                            </div>
                            <div class="ifo_singer">
                                <h4 class="f-thide">张惠妹aMEI</h4>
                                <p class="f-thide">台湾歌手张惠妹</p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;" class="singerItem">
                            <div class="img_singer">
                                <img src="../public/upload/singer2.jpg" alt="">
                            </div>
                            <div class="ifo_singer">
                                <h4 class="f-thide">Fine乐团</h4>
                                <p class="f-thide">独立音乐人</p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;" class="singerItem">
                            <div class="img_singer">
                                <img src="../public/upload/singer3.jpg" alt="">
                            </div>
                            <div class="ifo_singer">
                                <h4 class="f-thide">萬曉利</h4>
                                <p class="f-thide">民谣歌手、中国现代民谣的代表人物之一</p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;" class="singerItem">
                            <div class="img_singer">
                                <img src="../public/upload/singer4.jpg" alt="">
                            </div>
                            <div class="ifo_singer">
                                <h4 class="f-thide">音乐人赵雷</h4>
                                <p class="f-thide">民谣歌手</p>
                            </div>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;" class="singerItem">
                            <div class="img_singer">
                                <img src="../public/upload/singer5.jpg" alt="">
                            </div>
                            <div class="ifo_singer">
                                <h4 class="f-thide">王三溥</h4>
                                <p class="f-thide">音乐人</p>
                            </div>
                        </a>
                    </li>
                </ul>
                <div class="applyForSinger">
                    <a href="javascript:;">申请成为网易音乐人</a>
                </div>
            </div>
            <!-- 热门主播 -->
            <div class="popular_anchor">
                <div class="n_hd">
                    <h3>
                        <span>热门主播</span>
                    </h3>
                </div>
                <ul class="n-hotdj">
                    <li>
                        <a href="/user/home?id=278438485" class="cver">
                            <img class="j-img" src="../public/upload/dj1.jpg">
                        </a>
                        <div class="info">
                            <p><a href="javascript:;" class="f-thide">陈立</a></p>
                            <p class="f-thide dj_d">心理学家、美食家陈立教授</p>
                        </div>
                    </li>
                    <li>
                        <a href="/user/home?id=278438485" class="cver">
                            <img class="j-img" src="../public/upload/dj2.jpg">
                        </a>
                        <div class="info">
                            <p><a href="javascript:;" class="f-thide">刘维-Julius</a></p>
                            <p class="f-thide dj_d">歌手、播客节目《维维道来》主理人</p>
                        </div>
                    </li>
                    <li>
                        <a href="/user/home?id=278438485" class="cver">
                            <img class="j-img" src="../public/upload/dj3.jpg">
                        </a>
                        <div class="info">
                            <p><a href="javascript:;" class="f-thide">莫非定律MoreFeel</a></p>
                            <p class="f-thide dj_d">男女双人全创作独立乐团</p>
                        </div>
                    </li>
                    <li>
                        <a href="/user/home?id=278438485" class="cver">
                            <img class="j-img" src="../public/upload/dj4.jpg">
                        </a>
                        <div class="info">
                            <p><a href="javascript:;" class="f-thide">碎嘴许美达</a></p>
                            <p class="f-thide dj_d">脱口秀网络红人</p>
                        </div>
                    </li>
                    <li>
                        <a href="/user/home?id=278438485" class="cver">
                            <img class="j-img" src="../public/upload/dj5.jpg">
                        </a>
                        <div class="info">
                            <p><a href="javascript:;" class="f-thide">银临Rachel</a></p>
                            <p class="f-thide dj_d">古风音乐人</p>
                        </div>
                    </li>
                </ul>
            </div>
        </div>

    </div>
    <!-- 底部 -->
    <footer class="footer">
        <div class="f-ft">
            <div class="copy">
                <p class="link">
                    <a href="#">服务条款</a>
                    <span class="line">|</span>
                    <a href="#">隐私政策</a>
                    <span class="line">|</span>
                    <a href="#">儿童隐私政策</a>
                    <span class="line">|</span>
                    <a href="#">版权投诉指引</a>
                    <span class="line">|</span>
                    <a href="#">意见反馈</a>
                    <span class="line">|</span>
                    <a href="#">广告合作</a>
                </p>
                <p class="shangbiaoTemp">网易公司版权所有©1997-2021&nbsp;&nbsp;&nbsp;&nbsp;杭州乐读科技有限公司运营：<a href="#">浙网文[2021]
                        1186-054号</a></p>
                <p class="shangbiaoTemp">违法和不良信息举报电话：0571-89853516&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;举报邮箱：<a
                        href="#">ncm5990@163.com</a></p>
                <p class="shangbiaoTemp"><a href="#">粤B2-20090191-18 工业和信息化部备案管理系统网站</a> &nbsp;&nbsp;&nbsp;<a
                        href="#"><span class="police"></span> 浙公网安备 33010902002564号</a></p>
            </div>
            <ul class="enter">
                <li>
                    <a href="#" class="f_logo f_logo_1"></a>
                    <span class="f_span f_span_1"></span>
                </li>
                <li>
                    <a href="#" class="f_logo f_logo_2"></a>
                    <span class="f_span f_span_2"></span>
                </li>
                <li>
                    <a href="#" class="f_logo f_logo_3"></a>
                    <span class="f_span f_span_3"></span>
                </li>
                <li>
                    <a href="#" class="f_logo f_logo_4"></a>
                    <span class="f_span f_span_4"></span>
                </li>
                <li>
                    <a href="#" class="f_logo f_logo_5"></a>
                    <span class="f_span f_span_5"></span>
                </li>
            </ul>
        </div>
    </footer>
    <!-- 播放条 -->
    <div class="g-btmbar">
        <div class="m-playbar m-playbar-unlock" style="visibility: visible; top: -7px;" id="auto-id-4ndXlkA9ebUV8Wsv">
            <div class="updn">
                <div class="left f-fl"><a href="javascript:;" class="btn" hidefocus="true" data-action="lock"></a></div>
                <div class="right f-fl"></div>
            </div>
            <div class="bg"></div>
            <div class="hand" title="展开播放条"></div>
            <div class="wrap" id="g_player" style="margin-left: -498.5px;">
                <div class="btns">
                    <a href="javascript:;" hidefocus="true" data-action="prev" class="prv" title="上一首(ctrl+←)">上一首</a>
                    <a href="javascript:;" hidefocus="true" data-action="play" class="ply j-flag"
                        title="播放/暂停(p)">播放/暂停</a>
                    <a href="javascript:;" hidefocus="true" data-action="next" class="nxt" title="下一首(ctrl+→)">下一首</a>
                </div>
                <div class="head j-flag"><img
                        src="http://p3.music.126.net/noDoYIRHP0oqaChnM66nSA==/109951166298067674.jpg?param=34y34"><a
                        href="/song?id=1862332624" hidefocus="true" class="mask"></a></div>
                <div class="play">
                    <div class="j-flag words"> <a hidefocus="true" href="/song?id=1862332624"
                            class="f-thide name fc1 f-fl" title="Sundays (Just Piano Version)">Sundays (Just Piano
                            Version)</a><a hidefocus="true" href="/mv?id=14306903" class="mv f-fl" title="MV"></a><span
                            class="by f-thide f-fl"><span title="FKJ"><a class="" href="/artist?id=797159"
                                    hidefocus="true">FKJ</a></span></span><a
                            href="/playlist?id=6827562995&amp;_hash=songlist-1862332624" class="src" title="来自歌单"></a>
                    </div>
                    <div class="m-pbar" data-action="noop">
                        <div class="barbg j-flag" id="auto-id-mBsePfdSdx22QS6C">
                            <div class="rdy" style="width: 0px;"></div>
                            <div class="cur" style="width:0%;"><span class="btn f-tdn f-alpha"
                                    id="auto-id-66HN2GkBaiZvX4sp"><i></i></span></div>
                        </div>
                        <span class="j-flag time"><em>00:00</em> / 00:00</span>
                    </div>
                </div>
                <div class="oper f-fl"><a href="javascript:;" hidefocus="true" class="icn icn-pip"
                        title="画中画歌词">画中画歌词</a>
                    <a href="javascript:;" hidefocus="true" data-action="like" class="icn icn-add j-flag"
                        title="收藏">收藏</a>
                    <a href="javascript:;" hidefocus="true" data-action="share" class="icn icn-share" title="分享">分享</a>
                </div>
                <div class="ctrl f-fl f-pr j-flag">
                    <div class="m-vol" style="visibility:hidden;" id="auto-id-QQO4f8QuF5LHeMKV">
                        <div class="barbg"></div>
                        <div class="vbg j-t" id="auto-id-faTUNv9VvEl65yRM">
                            <div class="curr j-t" style="height: 74.4px;"></div>
                            <span class="btn f-alpha j-t" style="top: 16.2px;"></span>
                        </div>
                    </div>
                    <a href="javascript:;" hidefocus="true" data-action="volume" class="icn icn-vol"></a>
                    <a href="javascript:;" hidefocus="true" data-action="mode" class="icn icn-loop" title="循环"></a>
                    <span class="add f-pr">
                        <span class="tip" style="display:none;">已添加到播放列表</span>
                        <a href="javascript:;" title="播放列表" hidefocus="true" data-action="panel"
                            class="icn icn-list s-fc3">10</a>
                    </span>
                    <div class="tip tip-1" style="display:none;">循环</div>
                </div>
            </div>
        </div>
    </div>
    <audio
        src="http://m8.music.126.net/20211005115244/324dfa56d2ea22906495857c7bab4ec6/ymusic/77c9/eead/eb06/4162ccb250b121af77f5750defcfed1c.mp3"
        autoplay="true" controls id="audio"></audio>
 
</body>
<script src="../node_modules/jquery/dist/jquery.js"></script>
<script src="../node_modules/bootstrap/dist/js/bootstrap.js"></script>
<script src="../public/js/banner.js"></script>
<script src="../public/js/new_disc.js"></script>
<script src="../public/js/hot_recommended.js"></script>
<script src="../public/js/newest.js"></script>
<script src="../public/js/music_list.js"></script>
<!-- <script src="../public/js/n-singer.js"></script> -->
<script>
    let songList = $('.songList');
    songList.on('click', function () {
        sessionStorage.setItem('cat', '全部')
        sessionStorage.setItem('currentPage', 1)
    })
</script>
<script src="../public/js/playJD.js"></script>
<script>
    let audio = $('audio');
    audio.on('click', function () {
        console.log(this);
    })

</script>

</html>